<template>
<h1>修改密码</h1>
  <span>请输入旧密码</span>
  <el-input v-model="oldPwd" @blur="comparePwd" style="width: 150px"></el-input><br>
  <span>请输入新密码</span>
  <el-input type="password" autocomplete="off" v-model="newPwd" style="width: 150px"></el-input><br>
  <span>请确认新密码</span>
  <el-input type="password" autocomplete="off" v-model="ackPwd" @blur="queRen" style="width: 150px"></el-input><br>
  <el-button type="primary" @click="modifyPwd">修改</el-button>
</template>

<script>
import axios from "axios";
import {ElMessage} from "element-plus";

export default {
  name: "ModifyPassWord",
  data(){
    return{
      oldPwd:'',
      newPwd:'',
      ackPwd:'',
      isRight:false
    }
  },
  methods:{
    comparePwd(){
      let param =new URLSearchParams();
      param.append("oldPwd",this.oldPwd);
      axios.post("/api/user/comparePassWord",param).then(response=>{
         if (response.data=='success'){
            this.isRight = true
         }else {
            this.oldPwd = '';
           ElMessage.error("旧密码有误，请重新输入")
         }
      })
    },
    modifyPwd(){
      if (this.isRight==true && this.newPwd==this.ackPwd && this.newPwd!=''){
        let param = new URLSearchParams();
        param.append("newPwd",this.newPwd);
        axios.post("/api/user/modifyPassWord",param).then(response=>{
          if (response.data=='success'){
            this.$router.push("/")
          }
        })
      }
    },
    queRen(){
       if (this.newPwd != this.ackPwd){
         ElMessage.error("确认密码必须与新密码一致")
       }
    }
  }
}
</script>

<style scoped>

</style>